<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册界面</title>
    <style>
        body {
            background: url("../img/bg.png");
        }

        .center {
            background-color: white;
            width: 500px;
            text-align: center;
            margin: auto;
        }
    </style>
</head>
<body>
<div class="center">
    <img src="../img/itheima.png" align="center" width="500" >
    <br/><br/>
    <div>注册详情</div>
    <hr/>
    <form action="#" method="post" autocomplete="off">
        <label for="username">用户名：</label>
        <input type="text" id="username" name="username" maxlength="4" placeholder="请输入姓名" required/>
        <br/><br/>

        <label for="password">密&nbsp;&nbsp;&nbsp;码：</label>
        <input type="password" id="password" name="password" placeholder="请输入密码" required/>
        <br/><br/>

        <label for="email">邮&nbsp;&nbsp;&nbsp;箱：</label>
        <input type="email" id="email" name="email" placeholder="请输入邮箱地址" required/>
        <br/><br/>

        <label for="gender">性&nbsp;&nbsp;&nbsp;别：</label>
        <input type="radio" id="gender" name="gender" value="men"/>男&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <input type="radio" name="gender" value="women"/>女
        <br/><br/>

        <label for="age">年&nbsp;&nbsp;&nbsp;龄：</label>
        <input type="number" id="age" name="age" min="1" required/>
        <br/><br/>

        <label for="birthday">生&nbsp;&nbsp;&nbsp;日：</label>
        <input type="date" id="birthday" name="birthday"/>
        <br/><br/>

        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        头&nbsp;&nbsp;&nbsp;像：<input type="file" name="selfile" multiple="multiple"/>
        <br/><br/>

        <label for="hobby">爱&nbsp;&nbsp;&nbsp;好：</label>
        <input type="checkbox" id="hobby" name="hobby" value="basketball"/>篮球
        <input type="checkbox" name="hobby" value="football"/>足球
        <input type="checkbox" name="hobby" value="dance"/>跳舞
        <input type="checkbox" name="hobby" value="sing"/>唱歌
        <input type="checkbox" name="hobby" value="anther"/>其他
        <br/><br/>

        <label for="city">所在城市：</label>
        <select id="city" name="city">
            <option>-- 请选择所在城市 --</option>
            <optgroup label="安徽省">
                <option>合肥市</option>
                <option>芜湖市</option>
                <option>黄山市</option>
                <option>滁州市</option>
            </optgroup>
            <optgroup label="浙江省">
                <option>杭州市</option>
                <option>金华市</option>
                <option>绍兴市</option>
                <option>温州市</option>
            </optgroup>
        </select>
        <br/><br/>

        个性签名：<textarea name="text" rows="5" cols="20"></textarea>
        <br/><br/>

        <button type="submit">提交</button>&nbsp;&nbsp;
        <button type="reset">重置</button>

    </form>
    <br/>
    <img src="../img/other2.png" width="500" align="center">
</div>

</body>
</html>